<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>


    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>登录</title>
<link  th:href="@{/css/bootstrap.min14ed.css?v=3.3.6}"  rel="stylesheet">
    <link th:href="@{/css/font-awesome.min93e3.css?v=4.4.0}"  rel="stylesheet">

    <link th:href="@{/css/animate.min.css}"  rel="stylesheet">
    <link th:href="@{/css/style.min862f.css?v=4.1.0}"   rel="stylesheet">
    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html" />
    <![endif]-->
    <script>if(window.top !== window.self){ window.top.location = window.location;}</script>
    <!-- CSRF -->
    <meta name="_csrf" th:content="${_csrf.token}"/>
    <!-- default header name is X-CSRF-TOKEN -->
    <meta name="_csrf_header" th:content="${_csrf.headerName}"/>

</head>

<body class="gray-bg">


<div class="middle-box text-center loginscreen  animated fadeInDown">
    <div>
        <div>

            <h1 class="logo-name">Ran</h1>

        </div>

      <!--  <div sec:authorize="isAuthenticated()"> 已经登录</div>
        <p th:if="${param.logout}" class="bg-warning">已注销</p>
        <p th:if="${param.error}" class="bg-danger">有错误，请重试</p>-->
<!--
        <span th:if="${param.error}" th:text="${session.SPRING_SECURITY_LAST_EXCEPTION.message}"></span>
-->
        <h2></h2>
        <!--<form class="form-signin" role="form"   id="login_form" name="form" th:action="@{/sys/login}"   method="post">-->
        <form class="form-signin" role="form"   id="login_form" name="form"     method="post">
            <div class="form-group">

                <input type="text" class="form-control" name="uname" placeholder="账号"/>
            </div>
            <div class="form-group">

                <input type="password" class="form-control" name="pwd" placeholder="密码"/>
            </div>
            <div class="form-group"   style="text-align:left">
     <input class="i-checks" type="checkbox" name="rememberme" />&nbsp;&nbsp;记住我
            </div>



            <button type="submit"  id="login_btn" class="btn btn-primary block full-width m-b">登 录</button>
            <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
           <!-- <p class="text-muted text-center"> <a href="login.html#"><small>忘记密码了？</small></a>  </p>-->
        </form>
        <!--<form th:action="@{/logout}" method="post">
            <input type="submit" class="btn btn-primary" value="注销"/>
        </form>-->
    </div>
</div>
<script src="/js/jquery.min.js?v=2.1.4"></script>
<script src="/js/bootstrap.min.js?v=3.3.6"></script>
<script>
	$(document).on('click', '.changeCaptcha', function () {
     var url = "/getKaptchaImage";
     $(".captcha").attr("src", url);
 })

	 $(document).on("click", "#login_btn", function () {
       var randomAnim = Math.floor(Math.random() * 7);
       var _ctx = $("meta[name='ctx']").attr("content");
       var token = $("meta[name='_csrf']").attr("content");
       var header = $("meta[name='_csrf_header']").attr("content");
       $.ajax({
           url: "/admin" + "/login",
           type: 'POST',
           data: $("#login_form").serialize(),
           beforeSend: function (request) {
               request.setRequestHeader(header, token);
           },
           success: function (data) {
               console.log(data);
              // alert(data.status);

               if (data.status == 'ok') {
                   //登录成功
                     //alert("OK");
              // window.location.reload();
             // window.location.href="/jump"
              window.location.href="/admin/"

               } else if (data.status == 'error') {
                 alert("用户名或密码错误!", {icon: 2, anim: randomAnim});
               } else {
                alert("验证码错误", {icon: 2, anim: randomAnim});
               }
           },
           error: function () {
            alert("出现错误，请尝试刷新页面!", {icon: 2, anim: 6});
           }
       });
       return false;
   });</script>
 </body>


 </html>
